<script setup>

import {ref} from "vue";
import router from "@/router/index.js";
import {useCartStore} from "@/store/cartStore.js";
import {usetokenstore} from "@/store/token.js";
import {jwtDecode} from "jwt-decode";

const cartStore = useCartStore();
const searchBookName = ref("")

const toSearchBook=()=>{
  router.push({ name: 'bookSearch', params: { bookName:searchBookName.value } })
}

const emits = defineEmits(['addToCart']); // 定义emit事件
const addToCart = () => {
  emits('addToCart'); // 触发addToCart事件
 }

 const gotoCart=()=>{
  router.push("/cart")
 }
</script>

<template>
  <div class="row">
    <div class="col-md-3">
      <img src="@/images/DDlogoNEW.gif" alt="">
    </div>
    <div class="col-md-6">
      <form>
        <div class="input-group navbar-btn">
          <input v-model="searchBookName" type="text" name="bookName" placeholder="搜索图书名" id="" class="form-control">
          <div class="input-group-btn">
            <button  @click="toSearchBook" class="btn btn-danger"><span class="glyphicon glyphicon-search"></span></button>
          </div>
        </div>
      </form>
    </div>
    <div class="col-md-3">
      <ul class="nav nav-pills">
        <li class="bg-success" @click="gotoCart"><a href=""><span class="text-muted">购物车</span><span class="badge">{{cartStore.cartQuantity  }}</span></a></li>
        <li class="bg-info"><a href=""><span class="text-muted">我的订单</span></a></li>
      </ul>
    </div>
  </div>

</template>

<style scoped>

</style>